---
# Only the main Sass file needs front matter (the dashes are enough)
---
@charset "utf-8"


// # Breakpoints

$breakpoint-hide-sidebar: 1280px
$breakpoint-mobile: 767px


// # Font

$font: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif


// # Sidebar Background Gradient

$gradient-start: #C2E987
$gradient-end:   #309E85

$sidebar-bg: linear-gradient(136deg, $gradient-start, $gradient-end)


// # Sidebar Left
$sidebar-left-width: 170px

// Avatar
$avatar-size: 128px
$avatar-border-size: 4px
$avatar-border-color: rgba(255, 255, 255, .75)

// Social icons
$social-icon-outer-padding: 10px

$social-icon-size: 22px
$social-icon-margin: 1px

$social-icon-color: rgba(255, 255, 255, .6)
$social-icon-hover-color: #FFF

// Tags
$tag-height: 50px
$tag-font-size: 17px

$tag-color: #ffffff
$tag-hover-color: rgba(255, 255, 255, .85)
$tag-active-color: $gradient-end

$tag-border-color: rgba(255, 255, 255, .5)


// # Sidebar Right
$sidebar-right-width: 380px

// Search
$search-box-height: 64px
$search-box-font-size: 18px

$search-box-color: #FFF
$search-box-placeholder: rgba(255, 255, 255, .7)
$search-box-bg: rgba(255, 255, 255, .3)

// Toc
$toc-color: #080E09
$toc-bg: $tag-border-color

$toc-font-size: 16px
$toc-line-height: 22px

$toc-bullet-size: 18px
$toc-bullet-unread: $gradient-end
$toc-bullet-read: $toc-color


// # Sidebar width
$sidebar-width: $sidebar-left-width + $sidebar-right-width + 1



// # Post

$post-max-width: 800px
$post-width-at-3-columns: 80%
$post-width-at-1-column: 720px

$post-meta-color: #BCC1C4

$post-title-color: #159957
$post-text-color: #283444
$post-link-color: lighten($post-text-color, 20%)
$post-link-hover-color: $gradient-end

$post-bg: #F8F8F8

$post-img-border-color: darken($post-bg, 4%)
$post-img-border-width: 4px

$post-code-inline-color: #B31616
$post-code-inline-bg: darken($post-bg, 2%)
$post-code-font: 'Droid Sans Mono', monospace

$post-code-block-bg: #FDFDFD

$post-font-size: 18px
$post-line-height: 1.6
$post-paragraph-spacing: 30px

$post-hr-color: darken($post-bg, 5%)

$post-share-bg: darken($post-bg, 1%)
$post-share-color: $post-meta-color
$post-share-hover-color: $gradient-end


// # Footer (copyright)

$footer-color: $post-meta-color
$footer-link-hover-color: $gradient-end

$footer-font-size: 14px
$footer-line-height: 20px



// # Menu button position

$menu-top: 20px
$menu-right: 30px



// # Customise webkit scrollbar

$toc-scrollbar-width: 3px
$toc-scrollbar-color: $gradient-end

$code-scrollbar-height: 7px
$code-scrollbar-color: $post-meta-color



// # NProgerss

$nprogress-height: 3px
$nprogress-color: red



// # Time function

$time-function: cubic-bezier(0.770, 0.000, 0.175, 1.000)



// @import

@import '1-animation'
@import '2-icon'
@import '3-base'
@import '4-sidebar'
@import '5-post'
@import '6-menu'
@import '7-nprogress'
@import '8-code'
@import '9-page'
@import 'a-smallscreen'
@import 'b-mobile'
@import 'c-index.sass'
